<!-- 岗位管理 -->
<template>
  <div class='post_management'>
    <Row class="detail_title">
      <Col span="8">
      <span class="title_text">共{{pageData.total}}个岗位</span>
      </Col>
      <Col span="2" offset="14">
      <Col span="12"><Button type="primary" @click="createPost"
        v-if="unlocking('0211010000')">新建岗位</Button></Col>
      </Col>
    </Row>
    <dt-grid ref="table" :page="pageData" :onFetch='onFetch' />
    <job-post ref="jobPost" @success='onSuccess' />
  </div>
</template>
<script>
  import columnsAll from './opt/columns'
  import jobApi from '@/biz/postManagement'
  import jobPost from './components/createJobPost.vue'
  export default {
    components: { jobPost },
    data() {
      return {
        list: [],
        columns: [],
        pageData: {
          total: 0,
          current: 1,
          rows: 10,
          pageSizeOpts: [10, 20, 30, 40, 50],
        },
      }
    },
    methods: {
      //新建岗位
      createPost() {
        let data = {
          title: '新建岗位',
        }
        this.$refs.jobPost.create(data)
      },
      //编辑
      onEdit(data) {
        console.log(data)
        data.title = '编辑岗位'
        this.$refs.jobPost.edit(data)
      },
      //启用/禁用
      onDisable(data) {
        console.log(data)
        data.stateFlag = data.stateFlag == 1 ? 2 : 1
        jobApi.disablePosition(data).then((res) => {
          this.$Message.success(data.stateFlag == 1 ? '启用成功' : '禁用成功')
          this.onSuccess()
        })
      },
      onFetch(data) {
        return jobApi.getPages(data).then(res => {
          this.pageData.total = Number(res.total)
          return res
        })
      },
      onSuccess() {
        this.$refs.table.fetch()
      },
    },
    mounted() {
      this.$refs.table.init(this, new columnsAll(this))
      this.$refs.table.fetch()
    },
  }
</script>
<style lang='scss' scoped>
  .post_management {
    padding: 20px;

    .detail_title {
      margin-bottom: 30px;
    }
  }
</style>